import React from 'react';
import './index.less';
import PropTypes from 'prop-types';
import {ToastIcon,InputItem} from 'antd-mobile';
import CommonHeader from 'COMPONENT/CommonHeader';



export default class HmdMain extends React.Component {
    static contextTypes = {
        router: PropTypes.object.isRequired
    }
    constructor(props) {
        super(props);
        
        this.state = {
          termsData:[
          	{
          		'curPayDay':'2023-03-01',
          		'curPayMoney':'115.37',
          		'curPayInterest':'0.69',
          		'curPayTotalMoney':'116.06',
          		'curPayShouldMon':'115.37',
          		'curPayShouldInter':'0.69',
          		'curPayBalance':'2884.63'
          	},
          	{
          		'curPayDay':'2023-03-01',
          		'curPayMoney':'115.37',
          		'curPayInterest':'0.69',
          		'curPayTotalMoney':'116.06',
          		'curPayShouldMon':'115.37',
          		'curPayShouldInter':'0.69',
          		'curPayBalance':'2884.63'
			},
			{
				'curPayDay':'2023-03-01',
				'curPayMoney':'115.37',
				'curPayInterest':'0.69',
				'curPayTotalMoney':'116.06',
				'curPayShouldMon':'115.37',
				'curPayShouldInter':'0.69',
				'curPayBalance':'2884.63'
			}
          
          ]
        }
    }

    componentWillMount() {
        

    }

	backs = () => {
	 	this.context.router.push({
            pathname: '/Home'
        })
	 	return false;
	}
	
	
    render() {
    	let {termsData} = this.state;
    	let _this = this;
        return(
        	
            <div className="repaymentSchedule" style={{
            	height:'100%'
            }}>
				<CommonHeader 
					name='还款信息查询'					
					leftContentTitle="@back" 
					leftContent='返回'				
				/>
				<div style={{height:'.9rem'}}></div>
					{
						termsData.map((item,index)=>{
							return (
								<section className="lineSection">
									<div className="payBack_title">
										<span>期次</span>
										<span>{index+1}期</span>
									</div>
									<InputItem className="textRight" value={item['curPayDay']} editable={false}>
										当期还款日
						            </InputItem>
						           
						            <InputItem className="textRight" value={item['curPayMoney']} editable={false}>
										当期应还本金
						            </InputItem>
						            <InputItem className="textRight" value={item['curPayInterest']} editable={false}>
										当期应还利息
						            </InputItem>
						            
						            <InputItem className="textRight" value={item['curPayTotalMoney']} editable={false}>						
										当期应还总额
						            </InputItem>
						            <InputItem className="textRight"	value={item['curPayShouldMon']} editable={false}>
										截止当期累计应还本
						            </InputItem>
						            <InputItem className="textRight"	value={item['curPayShouldInter']} editable={false}>
										截止当期累计应还息
				
						            </InputItem>
						            <InputItem className="textRight"	value={item['curPayBalance']} editable={false}>
										截止当期计划本金余额
						            </InputItem>
								</section>
					            
							)
						})
					}

            </div>
        );
    }
}